{% extends "mytest/base.html" %}

{% block mainbody %}
<div>
    <div class="container">
        <div style="margin-bottom: 10px">
            <!-- 按钮触发模态框 -->
            <div class="row clearfix">
                <!-- 按钮触发模态框 -->
                <div style="margin-bottom: 10px;" class="col-lg-6">
                    <button class="btn btn-primary add-btn">
                        添 加
                    </button>
                </div>
                <!-- 搜索功能 -->
                  <div class="col-lg-6">
                    <form method="get">
                    <div class="input-group">
                            <input type="text" class="form-control" name="keyword" value="{{ data.keyword }}" placeholder="请输入关键字">
                            <span class="input-group-btn">
                                <button class="btn btn-default" type="submit">搜 索</button>
                            </span>

                    </div><!-- /input-group -->
                    </form>
                  </div><!-- /.col-lg-6 -->
            </div>
        <!-- 表格 -->
        <div class="bs-example" data-example-id="panel-without-body-with-table">
            <div class="panel panel-default">
              <!-- Default panel contents -->
              <div class="panel-heading">
                  <span class="glyphicon glyphicon-th-list" aria-hidden="true"></span>
                  用户列表
              </div>

              <!-- Table -->
              <table class="table">
                <thead>
                  <tr>
                      {% for field in data.form %}
                          {% if field.label != "密码" %}
                            <th>{{ field.label }}</th>
                          {% endif %}
                      {% endfor %}
                  </tr>
                </thead>
                <tbody>
                  {% for obj in data.rows %}

                  <tr>
{#                    <td>{{ obj.id }}</td>#}
{#                    <td>{{ obj.id|default:"" }}</td>#}
                    <td>{{ obj.name|default:"" }}</td>
{#                    <td>{{ obj.price }}</td>#}
                    <td>{{ obj.username|default:"" }}</td>
                    <td>{{ obj.phone_number|default:"" }}</td>
                      <td>{{ obj.get_role_display|default:"" }}</td>
                    <td>
                        <div class="btn-group" role="group" aria-label="">
                          <button uid="{{ obj.id }}" type="button" class="btn btn-default btn-xs edit-btn">编辑</button>
                          <button uid="{{ obj.id }}" type="button" class="btn btn-default btn-xs delete-btn">删除</button>
                        </div>
{#                        <input uid="{{ obj.id }}" type="button" class="btn btn-primary btn-xs edit-btn" value="编辑">#}
{#                        <input uid="{{ obj.id }}" type="button" class="btn btn-danger btn-xs delete-btn" value="删除">#}
{#                        {{ form.name }}#}
{#                        <a class="btn btn-danger btn-xs" href="mytest/data_edit.html">删除</a>#}
                    </td>
                  </tr>

                  {% endfor %}

                </tbody>
              </table>
            </div>
          </div>
        </div>
        <!-- 分页 -->
        <div aria-label="Page navigation">
          <ul class="pagination">
            <li>
                <a href="?pageNum=1">首页</a>
            </li>
            <li>
              <a href="?pageNum={% if data.pageNum > 1 %}{{ data.pageNum|add:"-1"}}{% else %}1{% endif %}" aria-label="Previous">
                <span aria-hidden="true">&laquo;</span>
              </a>
            </li>

            {% for i in data.pageNumList %}
            <li><a href="?pageNum={{ i }}">{{ i }}</a></li>
            {% endfor %}

            <li>
              <a href="?pageNum={% if data.pageNum < 30 %}{{ data.pageNum|add:"+1"}}{% else %}1{% endif %}" aria-label="Next">
                <span aria-hidden="true">&raquo;</span>
              </a>
            </li>
            <li>
                <a href="#">尾页</a>
            </li>
            <li>
                <form style="float: right;" method="get">
                    <label>
                        <input name="pageNum" type="text" value="{{ pageNum }}" style="float:left;width: 80px;border-radius: 0;display: inline-block;" class="form-control" placeholder="页码">
                        <button type="submit" style="border-radius: 0" class="btn btn-default">跳转</button>
                    </label>
                </form>

            </li>
          </ul>
        </div>
    </div>
</div>
{% endblock %}
